<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="height:400px ;width:900px"></div>
    <!-- ECharts单文件引入 -->
    <script src="js/echarts/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: 'js/echarts/dist'
            }
        });
        
        // 使用
        require(
            [
                'echarts',
				'echarts/theme/macarons', //主题
				'echarts/chart/bar', // 按需加载
				'echarts/chart/scatter', // 按需加载
				'echarts/chart/k', // 按需加载
				'echarts/chart/pie', // 按需加载
				'echarts/chart/radar', // 按需加载
				'echarts/chart/map', // 按需加载
				'echarts/chart/force', // 按需加载
				'echarts/chart/chord', // 按需加载
				'echarts/chart/funnel', // 按需加载
				'echarts/chart/gauge', // 按需加载
				'echarts/chart/eventRiver', // 按需加载
				'echarts/chart/treemap', // 按需加载
				'echarts/chart/venn', // 按需加载
                'echarts/chart/line', // 按需加载
				'echarts/chart/bar' // 按需加载
            ],
            function (ec,theme) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main'),theme); 
                
                var option = {
				    title : {
						text: 'mzy_test',
						subtext: 'Test only'
					},
					tooltip : {
						trigger: 'axis'
					},
					//legend: {
					//	data:['最高','最低']
					//},
					toolbox: {
						show : true,
						feature : {
							mark : {show: true},
							dataZoom : {show: true},
							dataView : {show: true, readOnly: true},
							magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
							restore : {show: true},
							saveAsImage : {show: true}
						}
					},
					calculable : true,
					dataZoom : {
						show : true,
						realtime : true,
						start :80,
						end : 100
					},
					xAxis : [
						{
							type : 'category',
							boundaryGap : true,
							data : function (){
								var list = [];
								//改成一年的
								for(var j=1;j<=12;j++){
									for (var i = 1; i <= 30; i++) {
										list.push('2013-'+j+'-' + i);
									}
								}
								return list;
							}()
						}
					],
					yAxis : [
						{
							type : 'value',
							scale: true,
							name :'温度',
							boundaryGap: [0.01, 0.01],
							axisLabel : {//单位
								formatter: '{value} °C'
							}
						}
					],
					series : [
						{
							name:'数据',
							type:'line',
							data:function (){
								var list = [];
								for(var j=1;j<=12;j++){
									for (var i = 1; i <= 30; i++) {
										list.push(Math.round(Math.random()* 40+100));
									}
								}
								return list;
							}(),
							 markPoint : {
									data : [
										{type : 'max', name: '最大值'},
										{type : 'min', name: '最小值'}
									]
							},
							markLine : {
								data : [
									{type : 'average', name: '平均值'}
								]
							}
						}
					]
				};
        
                // 为echarts对象加载数据 
                myChart.setOption(option); 
            }
        );
    </script>
</body>